// 引入依赖
import Vue from 'vue'
import Router from 'vue-router'
// 引入组件
// import HelloWorld from '@/components/HelloWorld'
// import cart from '../components/cart.vue'
// import comA from '../components/componentA.vue'
// import notFound from '../components/notfound.vue'

// 路由懒加载
const HelloWorld = () => import('../components/HelloWorld')
const cart = () => import('../components/cart')
const comA = () => import('../components/componentA')
const notFound = () => import('../components/notFound')
const index = () => import('../components/index')
const list = () => import('../components/list')
const detail = () => import('../components/detail')

Vue.use(Router)

// 路由就是路径和组件的对应关系
export default new Router({
  mode: 'history',
  // 路由表
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld
    },
    {
      path: '/cart',
      name: 'cart',
      component: cart
    },
    {
      path: '/comA',
      name: 'comA',
      component: comA
    },
    {
      path: '/list',
      name: 'list',
      component: list
    },
    {
      path: '/detail/:name',
      name: 'detail',
      component: detail
    },
    {
      path: '/index',
      component: index,
      children: [
        {path: '', component: HelloWorld},
        {path: 'cart', component: cart},
        {path: 'comA', component: comA},
      ]
    },
    // 处理404页面
    {
      path: '*',
      component: notFound
    }
  ]
})